<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { gethospitaldetails } from '@/api/hospital';
import { useCounterStore } from '@/stores/counter';
import { useRouter } from 'vue-router';
import type { Ref } from 'vue';
import { getdepartment } from '@/api/getdepartment';
interface IHospitalInfo {
    id:number
    kinds: string
    grade: string
    name: string
    image: string
    desc: string
    text:string
}
const hospitalInfo: Ref<IHospitalInfo[]> = ref([{ kinds: '', grade: '', name: "", image: '', desc: '',text:'',id:0 }])
const use = useCounterStore()
onMounted(() => {
    gethospitaldetails({ id: use.hospital }).then(res => {
        hospitalInfo.value = res.data
        // console.log(hospitalInfo.value);
    })
})
const router = useRouter()
function onClickLeft() {
    router.back()
}

const activeId = ref(1);
const activeIndex = ref(0);
const item = ref([])

onMounted(() => {
    getdepartment().then(res => {
        item.value = res.data.data
    })
})

function getHomePage(id:Number){
    use.gethospitalInfo(id)
    router.push('/hospitalinfo')
}
const value = ref('')
</script>
<template>
    <van-nav-bar title="预约挂号" left-arrow @click-left="onClickLeft" />
    <div class="box">
        <div class="content">
            <div class="box_top">
                <div>
                    <h5>{{ hospitalInfo[0].name }}</h5>
                    <span>{{ hospitalInfo[0].grade }}——</span>
                    <span>{{ hospitalInfo[0].kinds }}——</span>
                    <span>{{ hospitalInfo[0].desc }}</span>
                </div>
                <van-icon name="hotel-o" @click="getHomePage(hospitalInfo[0].id)" size="0.3rem"/>
            </div>
            <van-search v-model="value" placeholder="请输入搜索关键词" />
            <van-tree-select v-model:active-id="activeId" v-model:main-active-index="activeIndex" :items="item"
                height="100%" />
        </div>
    </div>
</template>
<style lang="scss" scoped>
.box_top {
    display: flex;
    height: 1.0rem;
}
</style>